<template>
  <div v-if="showSearch">
    <van-search
      v-model="value"
      show-action
      placeholder="搜索关键词"
      @search="onSearch"
      @cancel="onCancel"
    />
  </div>
</template>

<script>
import {
  knowGirls,
  interChats,
  updateRelation,
  intimateMaintenance,
  conventionalLearning,
} from "../data/data";
import { mapGetters } from "vuex";
export default {
  data() {
    return {
      value: "",
      contents: {
        ...knowGirls,
        ...interChats,
        ...updateRelation,
        ...intimateMaintenance,
        ...conventionalLearning,
      },
      list: [],
    };
  },
  mounted() {
    console.log(this.$store);
  },
  computed: {
    ...mapGetters(["showSearch"]),
  },
  methods: {
    onSearch(key) {
      key = key.trim();
      if (!key) return vant.Toast("请输入关键字");
      this.$store.commit("setShowDialog", true);
      console.log("showDialog---", this.$store.state.showDialog);
      // this.dialogTitle = `${key}的搜索结果`;
      this.$store.commit("setDialogTitle", `${key}的搜索结果`);
      const keys = Object.keys(this.contents);
      if (keys.indexOf(key) === -1) {
        let target = -1;
        keys.forEach((word, i) => {
          if (word.indexOf(key) > -1) {
            target = i;
          }
        });
        key = keys[target];
      }
      if (!key) {
        this.list = [];
      }
      this.list = Object.assign({}, this.contents[key]);
      // this.list={...this.contents[key]}
      // console.log(this.contents[key]);
      console.log(this.list.length);
      this.$store.commit("setSearchResultList", this.list);
    },
    onCancel() {
      this.$store.commit("setShowSearch", false);
    },
  },
};
</script>

<style lang="scss" scoped>
</style>